<style itemscope>
  .layui-form-label.required:before {
    /* 这种写法也可以*/
    content: " *";
    color: red;
  }

  .addProductionPlanForm-title .title,
  .examineProductionPlanForm-title .title {
    display: inline-block;
    margin: 20px;
    font-size: 16px;
    font-weight: bold;
    color: #333333;
    line-height: 19px;
    position: relative;
    padding: 6px 0 19px 0;
  }

  .addProductionPlanForm-title .title:after,
  .examineProductionPlanForm-title .title:after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    width: calc(100% + 6px);
    height: 3px;
    background: #0a8b0a;
  }

  .purQualityTaskAddForm .layui-form-label {
    float: left;
    display: block;
    padding: 9px 4px 9px 15px;
    width: 113px;
    font-weight: 400;
    line-height: 20px;
    text-align: right;
  }

  .layui-form-select dl {
    left: 33px;
    min-width: 85%;
  }
</style>
<!-- 表单弹窗 -->
<form lay-filter="purQualityTaskAddForm" class="layui-form open-form purQualityTaskAddForm">
  <div class="open-model">
    <div class="open-auto">
      <div class="layui-row">
        <div class="layui-col-md3">
          <label class="layui-form-label required" style="width: 110px !important;text-align: right;box-sizing: border-box;">来源：</label>
          <div class="layui-input-block">
            <select id="sourceType" name="sourceType" lay-filter="sourceType">
              <option value="1" selected>按采购订单</option>
              <option value="2">按供应商发货物流</option>
            </select>
          </div>
        </div>
        <div class="layui-col-md3" id="reportOrderIdBox">
          <label class="layui-form-label w-auto required" style="padding-right: 4px;" id="orderName">选择采购单：</label>
          <div class="layui-input-block">
            <input type="hidden" name="supplierId" id="supplierId" />
            <input type="hidden" name="orderId" id="orderId" />
            <input
                    name="orderCode"
                    id="orderCode"
                    class="layui-input"
                    type="text"
                    placeholder="请选择"
                    readonly="readonly"
                    style="cursor: pointer;" />
          </div>
        </div>
        <div class="layui-col-md3">
          <label class="layui-form-label w-auto required" style="padding-right: 4px;">质检物料：</label>
          <div class="layui-input-block">
            <select id="productDetailId" name="productDetailId" lay-filter="productDetailId">
            </select>
          </div>
        </div>
      </div>
      <div class="examineProductionPlanForm-title">
        <h3 class="title" id="titName">采购单信息</h3>
      </div>
      <!--采购单信息-->
      <div class="purchase-info">
        <div class="layui-form-item layui-row">
          <div class="layui-col-md3">
            <label class="layui-form-label w-auto">采购类型：</label>
            <div class="layui-input-block">
              <input disabled name="purchaseTypeName" placeholder="采购类型" type="text" class="layui-input" autocomplete="off" />
            </div>
          </div>
          <div class="layui-col-md3">
            <label class="layui-form-label w-auto">物料数：</label>
            <div class="layui-input-block">
              <input disabled name="productNum" placeholder="物料数" type="text" class="layui-input" autocomplete="off" />
            </div>
          </div>
          <div class="layui-col-md3">
            <label class="layui-form-label w-auto">供应商：</label>
            <div class="layui-input-block">
              <input disabled name="corporateName" placeholder="供应商" type="text" class="layui-input" autocomplete="off" />
            </div>
          </div>
          <div class="layui-col-md3">
            <label class="layui-form-label w-auto">联系人：</label>
            <div class="layui-input-block">
              <input disabled name="businessContactName" placeholder="联系人" type="text" class="layui-input" autocomplete="off" />
            </div>
          </div>
        </div>
        <div class="layui-form-item layui-row">
          <div class="layui-col-md3">
            <label class="layui-form-label w-auto">制单人：</label>
            <div class="layui-input-block">
              <input disabled name="creatorName" placeholder="制单人" type="text" class="layui-input" autocomplete="off" />
            </div>
          </div>
          <div class="layui-col-md3">
            <label class="layui-form-label w-auto">审核人：</label>
            <div class="layui-input-block">
              <input disabled name="auditorNickname" placeholder="审核人" type="text" class="layui-input" autocomplete="off" />
            </div>
          </div>
          <div class="layui-col-md3">
            <label class="layui-form-label w-auto">创建时间：</label>
            <div class="layui-input-block">
              <input disabled name="createTime" placeholder="创建时间" type="text" class="layui-input" autocomplete="off" />
            </div>
          </div>
        </div>
      </div>
      <!--物流单-->
      <div class="logistics-info" style="display: none;">
        <div class="layui-form-item layui-row">
          <div class="layui-col-md3">
            <label class="layui-form-label w-auto">采购单编号：</label>
            <div class="layui-input-block">
              <input disabled name="sn" placeholder="采购单编号" type="text" class="layui-input" autocomplete="off" />
            </div>
          </div>
          <div class="layui-col-md3">
            <label class="layui-form-label w-auto">采购部门：</label>
            <div class="layui-input-block">
              <input disabled name="departmentName" placeholder="采购单编号" type="text" class="layui-input" autocomplete="off" />
            </div>
          </div>
          <div class="layui-col-md3">
            <label class="layui-form-label w-auto">发货物料数：</label>
            <div class="layui-input-block">
              <input disabled name="skuNum" placeholder="发货物料数" type="text" class="layui-input" autocomplete="off" />
            </div>
          </div>
          <div class="layui-col-md3">
            <label class="layui-form-label w-auto">金额：</label>
            <div class="layui-input-block">
              <input disabled name="totalAmount" placeholder="金额" type="text" class="layui-input" autocomplete="off" />
            </div>
          </div>
        </div>
        <div class="layui-form-item layui-row">
          <div class="layui-col-md3">
            <label class="layui-form-label w-auto">供应商：</label>
            <div class="layui-input-block">
              <input disabled name="corporateName" placeholder="供应商" type="text" class="layui-input" autocomplete="off" />
            </div>
          </div>
          <div class="layui-col-md3">
            <label class="layui-form-label w-auto">物流公司：</label>
            <div class="layui-input-block">
              <input disabled name="logisticsCompany" placeholder="物流公司" type="text" class="layui-input" autocomplete="off" />
            </div>
          </div>
          <div class="layui-col-md3">
            <label class="layui-form-label w-auto">运输方式：</label>
            <div class="layui-input-block">
              <input disabled name="transportModeDesc" placeholder="运输方式" type="text" class="layui-input" autocomplete="off" />
            </div>
          </div>
          <div class="layui-col-md3">
            <label class="layui-form-label w-auto">运单编号：</label>
            <div class="layui-input-block">
              <input disabled name="waybillNo" placeholder="运单号" type="text" class="layui-input" autocomplete="off" />
            </div>
          </div>
        </div>
        <div class="layui-form-item layui-row">
          <div class="layui-col-md3">
            <label class="layui-form-label w-auto">车牌号：</label>
            <div class="layui-input-block">
              <input disabled name="plateNo" placeholder="车牌号" type="text" class="layui-input" autocomplete="off" />
            </div>
          </div>
          <div class="layui-col-md3">
            <label class="layui-form-label w-auto">电话：</label>
            <div class="layui-input-block">
              <input disabled name="phone" placeholder="电话" type="text" class="layui-input" autocomplete="off" />
            </div>
          </div>
          <div class="layui-col-md3">
            <label class="layui-form-label w-auto">创建时间：</label>
            <div class="layui-input-block">
              <input disabled name="createTime" placeholder="创建时间" type="text" class="layui-input" autocomplete="off" />
            </div>
          </div>
        </div>
      </div>
      <div class="examineProductionPlanForm-title">
        <h3 class="title">任务配置</h3>
      </div>

      <div class="layui-form-item layui-row">
        <div class="layui-col-md3">
          <label class="layui-form-label w-auto required">质检类型：</label>
          <div class="layui-input-block">
            <select id="qcQualityTypeId" name="qcQualityTypeId" lay-filter="qcQualityTypeId" class="common-select-search"></select>
          </div>
        </div>
        <div class="layui-col-md3">
          <label class="layui-form-label w-auto required">质检分类：</label>
          <div class="layui-input-block">
            <select id="qualityTestingCategoryId" name="qualityTestingCategoryId" lay-filter="qualityTestingCategoryId" class="common-select-search"></select>
          </div>
        </div>
        <div class="layui-col-md3">
          <label class="layui-form-label w-auto required">送检类型：</label>
          <div class="layui-input-block">
            <select id="qualityTestingTypeId" name="qualityTestingTypeId" lay-filter="qualityTestingTypeId" class="common-select-search"></select>
          </div>
        </div>
        <div class="layui-col-md3">
          <label class="layui-form-label w-auto required">取样数量：</label>
          <div class="layui-input-block">
            <input id="submissionQuantity" name="submissionQuantity" placeholder="请输入数量" type="text" class="layui-input" autocomplete="off" />
          </div>
        </div>
      </div>

      <div class="layui-form-item layui-row">
        <div class="layui-col-md3">
          <label class="layui-form-label w-auto">载具编码：</label>
          <div class="layui-input-block">
            <input id="carrierCode" name="carrierCode" placeholder="请输入备注" type="text" class="layui-input" autocomplete="off" />
          </div>
        </div>
        <div class="layui-col-md3">
          <label class="layui-form-label w-auto">取样备注：</label>
          <div class="layui-input-block">
            <input id="remark" name="remark" placeholder="请输入备注" type="text" class="layui-input" autocomplete="off" />
          </div>
        </div>
        <div class="layui-col-md3">
          <label class="layui-form-label w-auto required">状态：</label>
          <div class="layui-input-block">
            <input id="statusName" style="border: none" name="statusName" readonly placeholder="待确认" type="text" class="layui-input" autocomplete="off" />
          </div>
        </div>
      </div>
    </div>
    <div class="layui-form-item text-right pd-20">
      <button class="layui-btn layui-btn-primary" type="button" ew-event="closeDialog">取消</button>
      <button class="layui-btn" id="addPurQualityTaskSubmit" type="button" lay-filter="addPurQualityTaskSubmit" lay-submit>保存</button>
    </div>
  </div>
</form>

<!-- js部分 -->
<script>
  layui.use(["layer", "form", "table", "laydate", "admin", "laytpl", "upload", "config"], async function () {
    var $ = layui.jquery;
    var layer = layui.layer;
    var config = layui.config;
    var upload = layui.upload;
    var table = layui.table;
    var admin = layui.admin;
    var form = layui.form;
    let nowData = {};
    let where = [];
    if (typeof parentData !== "undefined") {
      nowData = { ...parentData };
      if (nowData.where) {
        where = nowData.where;
      }
    }
    let _type = "";
    //选择报工单
    let templateData = admin.getTempData("workOrderQuaTaskInfoData");

    form.on('select(sourceType)', function(data) {
      $("#productDetailId").empty();
      $(".logistics-info").find('input').val('');
      $(".purchase-info").find('input').val('');
      $("input[name='orderCode']").val('');
      setPageTitle(data.value)
    });
    //认领
    if (templateData) {
      $(".purQualityTaskAddForm").find('select').attr("disabled", "disabled");
      $(".purQualityTaskAddForm").find('input').attr("disabled", "disabled");

      form.val("purQualityTaskAddForm", templateData);
      _type = templateData.type;
      let objInfo;
      if (templateData.sourceType == 1) { //查询采购订单详情
        objInfo = await admin.reqPro("enterprise/purchase/admin/purchaseOrder/detail/" + templateData.orderId);
      } else {
        objInfo = await admin.reqPro("enterprise/purchase/admin/purchaseDeliveryRecord/detail/" + templateData.orderId);
      }
      setPageTitle(templateData.sourceType);
      setFormValue(templateData.sourceType, objInfo.data)
    } else {
      _type = "add";
      $("#orderCode").click(function () {
        let sourceType = $("#sourceType").val();
        selectOrderDialog(sourceType);
      });

      function selectOrderDialog(type) {
        admin.formOpen({
          type: 1,
          title: type == 1 ? '选择采购单' : '选择供应商发货记录',
          area: "82%",
          offset: "65px",
          path: type == 1 ? 'components/purchase/purchaseOrder.html' : 'components/purchase/purchaseDeliveryRecord.html',
          success: function () {
            parentData.eventName = "radio";
            parentData.where = {
              status: "success"
            };
          },
          end: async function () {
            let list = childData.list;
            if (list && list.length > 0) {
              $("#productDetailId").empty();
              setFormValue(type, list[0]);
            }
          }
        });
      }
    }

    function setFormValue(type, obj) {
      $("input[name='createTime']").val(obj.createTime);
      $("input[name='orderId']").val(obj.id);
      $("input[name='supplierId']").val(obj.supplierId);
      if (type == 1) {
        $("input[name='orderCode']").val(obj.sn);
        $("input[name='purchaseTypeName']").val(obj.purchaseTypeName);
        $("input[name='productNum']").val(obj.productNum);
        $("input[name='corporateName']").val(obj.corporateName);
        $("input[name='businessContactName']").val(obj.businessContactName);
        $("input[name='creatorName']").val(obj.creatorName);
        $("input[name='auditorNickname']").val(obj.auditorNickname);
        // 获取采购物料
        admin.initDataSelectAndMap(
                "enterprise/purchase/admin/purchaseOrderDetail/list",
                { limit: 9999, purchaseOrderId: obj.id },
                "productDetailId",
                templateData == null ? null : templateData.productDetailId,
                "选择采购物料",
                "productName",
                "productDetailId",
                null
        );
      } else {
        $("input[name='orderCode']").val(obj.logisticsNo);
        $("input[name='sn']").val(obj.sn);
        $("input[name='departmentName']").val(obj.departmentName);
        $("input[name='skuNum']").val(obj.skuNum);
        $("input[name='totalAmount']").val(obj.totalAmount);
        $("input[name='corporateName']").val(obj.corporateName);
        $("input[name='logisticsCompany']").val(obj.logisticsCompany);
        $("input[name='transportModeDesc']").val(obj.transportModeDesc);
        $("input[name='waybillNo']").val(obj.waybillNo);
        $("input[name='plateNo']").val(obj.plateNo);
        $("input[name='phone']").val(obj.phone);
        // 获取发货物流物料
        admin.initDataSelectAndMap(
                "enterprise/purchase/admin/purchaseDeliveryRecordProduct/list",
                { limit: 9999, purchaseDeliveryRecordId: obj.id },
                "productDetailId",
                templateData == null ? null : templateData.productDetailId,
                "选择采购物料",
                "skuName",
                "skuId",
                null
        );
      }
    }

    function setPageTitle(type) {
      if (_type === "determine") {
        $("#addPurQualityTaskSubmit").text('认领');
      }
      if (type == 1) {
        $(".purchase-info").show();
        $(".logistics-info").hide();
        $("#orderName").text('选择采购单');
        $("#titName").text('采购单信息');
      } else {
        $(".logistics-info").show();
        $(".purchase-info").hide();
        $("#orderName").text('选择物流单');
        $("#titName").text('物流单信息');
      }
    }

    // 表单提交事件
    form.on("submit(addPurQualityTaskSubmit)", function (d) {
      layer.load(2);
      if (_type === "determine") {
        d.field.status = "inspect";
      }
      admin.req(
              templateData ? `enterprise/purchase/admin/purQualityTask/claim/${templateData.id}` : "enterprise/purchase/admin/purQualityTask/add",
              _type === "determine" ? {} : JSON.stringify(d.field),
              function (res) {
                layer.closeAll("loading");
                if (res.code == 200) {
                  layer.msg(res.msg, { icon: 1 });
                  table.reload("purQualityTaskTable");
                  layer.closeAll("page");
                } else {
                  layer.msg(res.msg, { icon: 2 });
                }
              },
              templateData ? "GET" : "POST",
              false,
              "application/json"
      );
      return false;
    });

    //初始化质检分类
    admin.initDataSelectAndMap(
            "production/qualityTesting/admin/qualityTestingCategory/list",
            { limit: 9999 },
            "qualityTestingCategoryId",
            templateData == null ? null : templateData.qualityTestingCategoryId,
            "质检分类",
            "name",
            "id",
            null
    );
    //初始化质检类型
    admin.initDataSelectAndMap(
            "production/qualityTesting/admin/qualityTestingType/list",
            { limit: 9999 },
            "qualityTestingTypeId",
            templateData == null ? null : templateData.qualityTestingTypeId,
            "送检类型",
            "name",
            "id",
            null
    );
    //质检类型
    admin.getDictList("qcQualityTypeId", "sys_qc_quality_type", templateData == null ? null : templateData.qcQualityTypeId, "质检类型");
  });
</script>
